<template>
  <x-tab class="flex-1" :title="'订单中心'" :isShowExpand="false" :isShowMore="true" @on-More="handleMore">
    <x-table
      :pagination="pagination"
      :data-source="tableData"
      :loading="loading"
      :height="203"
      :name="'orderTable'"
      :row-key="'id'"
      @on-change="handleTableChange"
      @on-selection-change="handleSelectionChange"
    >
      <el-table-column :label="$t('common.serialNumber')" :width="55" fixed type="index" />
      <el-table-column
        v-for="item in columns"
        :key="item.prop"
        :prop="item.prop"
        :fixed="item.fixed"
        :show-overflow-tooltip="true"
        :width="item.width"
        :label="item.label"
        :sortable="'custom'"
      >
        <template #default="scope">
          <x-state-cell
            v-if="item.prop === 'state'"
            :stateClass="scope.row[item.prop] === 0 ? 'gray' : scope.row[item.prop] ? 'success' : ''"
            :text="selectDictLabel(dictOptions['srm_purchase_order.state'], scope.row[item.prop] + '')"
          />
          <span v-else>{{ scope.row[item.prop] | emptyVal }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" :label="$t('common.opeartion')" :align="'center'" width="140">
        <template slot-scope="scope">
          <more-table-actions :action-list="actions" :row="scope.row" @onActionClick="handleActions" />
        </template>
      </el-table-column>
    </x-table>
  </x-tab>
</template>
<script>
  import { TableListMixin, selectDictLabel } from '@package/utils'
  import { orderColumns as columns, orderActions as actions } from '../config/homeConfig'
  import { supplierOrderUrl as listUrl } from '../api/index'

  export default {
    name: 'OrderCenter',
    mixins: [TableListMixin],
    props: {
      dictOptions: {
        type: Object,
        default: () => ({})
      }
    },
    data() {
      return {
        listUrl,
        loading: false,
        columns,
        actions,
        otherParam: {
          state: 1
        },
        /* 分页参数 */
        pagination: {
          pageNum: 1,
          pageSize: 5,
          total: 0
        }
      }
    },
    methods: {
      selectDictLabel,
      handleActions({ key, data }) {
        switch (key) {
          case 'view':
            this.$router.push({
              path: '/orderSynergy/purchaseOrder/purchaseOrderDetail',
              query: {
                id: data?.id
              }
            })
            break
          case 'agree':
            this.$router.push({
              path: '/orderSynergy/purchaseOrder/purchaseOrderDetail',
              query: {
                id: data?.id
              }
            })
            break
        }
      },
      handleMore() {
        this.$router.push({
          path: '/orderSynergy/purchaseOrder'
        })
      }
    }
  }
</script>
<style lang="scss" scoped>
  @import '../style/home';
</style>
